<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>往期精彩专题</title>
    <link rel="stylesheet" href="css/wonderful.css">
    
    <!-- 动态计算px-rem转换 -->
    <script>
        (function (doc, win) {
            var docEl = doc.documentElement,
            resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
            recalc = function () {
                var clientWidth = docEl.clientWidth;
                if (!clientWidth) return;
                docEl.style.fontSize = 100 * (clientWidth / 360) + 'px';
                docEl.getElementsByTagName("body")[0].style.fontSize = docEl.style.fontSize;
            };
            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, recalc, false);
            doc.addEventListener('DOMContentLoaded', recalc, false);
        })(document, window)
        
    </script>
</head>
<body>
    <div class="box">
        <a id="banner-one" class="banner" href="javascript:;"><img src="img/wonderful/banner1.png" alt=""></a>
        <a id="banner-two" class="banner" href="javascript:;"><img src="img/wonderful/banner2.png" alt=""></a>
    </div>
    
</body>
</html>